<template>
  <div class="ident_list">
    <head-top head-title="业主变更" go-back="true"></head-top>
    <div>
      <div class="ident_box border-bottom" v-for="(ident,index) in idents" :key="index"
           @click="$router.push('/my/IdentDetail/'+ident.id)">
        <div class="ident_img">
          <img src="./images/Hdefault.png" alt="">
        </div>
        <div class="ident_msg">
          <p>{{ident.areas_name}}</p>
          <p>{{ident.content}}</p>
          <p>状态：
            <span style="color: #0c7ad9" v-show="ident.status===1">未审核</span>
            <span style="color: #80d776" v-show="ident.status===2">已通过</span>
            <span style="color: red" v-show="ident.status===3">未通过</span>
          </p>
        </div>
        <div class="go_icon">
          <img src="../home/images/fanhui1@2x.png" alt="">
        </div>
      </div>
    </div>
    <div class="ident_addBtn">
      <div @click="toIndet()">
        <button>
          <span>立即认证</span>
        </button>
      </div>
    </div>
  </div>
</template>
<style lang="scss">
  .ident_list {
    width: 100%;
    padding-top: 40px;
    .ident_box {
      flex-direction: row;
      display: flex;
      align-items: center;
      .ident_img {
        width: 20%;
        img {
          width: 100%;
          opacity: 0.7;
        }
      }
      .ident_msg {
        width: 75%;
        p:first-child {
          font-size: 15px;
          color: #000;
        }
        p {
          font-size: 13px;
          color: #6e6e6e;
          line-height: 24px;
        }
      }
      .go_icon {
        width: 5%;
        img {
          width: 10px;
        }
      }
    }
    .ident_addBtn {
      width: 100%;
      text-align: center;
      margin-top: 20px;
      padding-bottom: 20px;
      button {
        width: 90%;
        background: #0078de;
        outline: none;
        span {
          line-height: 44px;
          font-size: 15px;
          color: #fff;
        }
      }
    }
  }
</style>
<script>
  import headTop from '../header/Header.vue'
  import { Toast } from 'mint-ui'
  import { getidentList } from '../../api/MyIdent'
  import {
    loadPhoneName
  } from '../../common/js/cache.js'

  export default {
    name: 'IdentList',
    data () {
      return {
        idents: []
      }
    },
    created () {
      this._getIdentList()
    },
    methods: {
      _getIdentList () {
        getidentList().then((res) => {
          // console.log(res)
          if (res.code === 200) {
            this.idents = res.data
          }
          if (res.code === 400) {
            Toast({
              message: res.error,
              position: 'middle',
              duration: 1500
            })
          }
        })
      },
      toIndet () {
        if ((loadPhoneName().phone === '0' || loadPhoneName().phone === '') || loadPhoneName().name === '') {
          this.$router.push('/EditData1')
          Toast({
            message: '请先编辑资料',
            position: 'middle',
            duration: 1500
          })
        } else {
          window.location.href = '/my/Ident'
        }
      }
    },
    components: {
      headTop
    }
  }
</script>
